<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
</head>
<body>
	<!-- Main content -->
	<section class="content">
		<div class="byking-row">
			<section class="byking-col-3">
				<div class="byking-panel" _tree="departmentList" id="departmentList">
					<div class="byking-panel-head">
						<div class="byking-panel-left">
							<i class="fa fa-sitemap"></i><font>部门列表</font>
						</div>
					</div>
					
					<div class="byking-panel-content" style="position: relative; height: 500px;">
						<ul class="byking-tree" id="byking-tree">
								<li v-for="(index, item) in page"  class="{{item.clazz}}" v-bind:data-tt-parent-id="item.parent_guid" @click="selectItem(item,$event)">
									<div style="{{'padding-left:'+ (item.level*15) + 'px'}}">
										<i v-if="!item.isLeaf"  class="fa fa-folder-open-o" @click="expand(item,$event)"></i>
										<i v-else  class="fa fa-file-o"></i>
										<font>{{item.name}}</font>
									</div>
								</li>
							</ul>
					</div>
				</div>
			</section>
			
			<section class="byking-col-7">
				<div class="byking-panel" id="departmentInfo" style="height:170px;">
					<div class="byking-panel-head">
						<div class="byking-panel-left">
							<i class="{{data.image}}"></i><font>部门信息</font>
						</div>
						<div class="byking-panel-right"> 
							<div class="byking-buts">
								<button @click="addParentDep()" v-if="is_superadmin == 1"
								        class="btn btn-default fa fa-university" 
								        data-toggle="tooltip" 
								        data-original-title="新增顶级组织"></button>
								<button @click="addDepartment()"  v-if="data!=null" 
								        class="btn btn-default fa fa-plus" 
								        data-toggle="tooltip" 
								        data-original-title="新增下级部门"></button>
								<button @click="modifyDepartment()" v-if="data!=null && (data.level > 1 || is_superadmin == 1)"
										class="btn btn-default fa fa-edit" 
										data-toggle="tooltip" 
										data-original-title="修改">
								</button>
								<button @click="deleteDepartment()" v-if="data!=null && (data.level > 1 || is_superadmin == 1)"
										class="btn btn-default fa fa-remove" 
										data-toggle="tooltip" data-original-title="删除">
								</button>
							</div>
						</div>
					</div>

					<div class="chart tab-pane active" style="position: relative; height: 120px;">
						<div class="byking-panel">
							<input type="hidden" name="guid" id="guid" value="{{data.guid}}">
							<!-- 显示区域 -->
							<div class="layui-form-item">
								<div class="byking-col-5" style="display: inline-block;">
									<label class="layui-form-label" style="width:90px">部门名称</label>
									<div class="layui-input-block">
										<input type="text" disabled value="{{data.name}}" class="layui-input">
									</div>
								</div>
								<div class="byking-col-5" style="display: inline-block;">
									<label class="layui-form-label" style="width:90px">部门图标</label>
									<div class="layui-input-block">
										<input type="text" disabled value="{{data.image}}" class="layui-input">
									</div>
								</div>
							</div>
							<div class="layui-form-item">
								<div style="width: 99%;">
									<label class="layui-form-label" style="width:90px">部门描述</label>
									<div class="layui-input-block">
										<input type="text" disabled value="{{data.description}}" class="layui-input">
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				
				<!-- 角色信息 -->
				<div class="byking-panel" _table="depRoleRel" id="depRoleRel" style="display: none">
					<div class="byking-panel-head">
						<div class="byking-panel-left">
							<i class="fa fa-user"></i><font>角色列表</font>
						</div>
					</div>
					
					<div v-if="total > 0">
						<table class="byking-table byking-table-bordered">
							<thead >
								<tr>
				    				<th>部门名称</th>
				    				<th>角色名称</th>
								</tr>
							</thead>
							<tbody>
								<tr v-for="(index,item) in page" class="byking-table-tr">
				    				<td>{{depName}}</td>
				    				<td>{{item.role_name}}</td>
				    			</tr>
							</tbody>
						</table>
					</div>
					
					<div v-if="total == 0" class="byking-content-empty">
						<font>没有数据</font>
					</div>
				</div>
				<!-- ./角色信息 -->
				
				<!-- 角色信息 -->
				<div class="byking-panel" _table="depUserRel" id="depUserRel" style="display: none">
					<div class="byking-panel-head">
						<div class="byking-panel-left">
							<i class="fa fa-users"></i>账户列表<font color="red">[{{depName}}]</font>
						</div>
						
						<div class="byking-panel-right">
							<div class="byking-buts">
								<button @click="custom(index,'add')" 
								        class="btn btn-default fa fa-user-plus" 
								        data-toggle="tooltip" 
								        data-original-title="新增账户"></button>
							</div>
						</div>
					</div>
					
					<div v-if="total > 0">
						<table class="byking-table byking-table-bordered">
							<thead >
								<tr>
				    				<th>账号</th>
				    				<th>姓名</th>
				    				<th>性别</th>
				    				<th>手机号码</th>
				    				<th>类型</th>
				    				<th>状态</th>
				    				<th>操作</th>
								</tr>
							</thead>
							<tbody>
								<tr v-for="(index,item) in page"  class="byking-table-tr">
				    				<td>{{item.username}}</td>
				    				<td>{{item.name}}</td>
				    				<td v-if="item.sex==0">女</td>
				    				<td v-else>男</td>
				    				<td>{{item.phone}}</td>
				    				<td v-if="item.status==1">非管理员</td>
		    						<td v-if="item.status==0">管理员</td>
				    				<td v-if="item.status==1"><font color="red">禁用</font></td>
		    						<td v-if="item.status==0"><font color="green">启用</font></td>
				    				<td>
					    				<button @click="custom(index,'modify')"
										        class="btn btn-default fa fa-pencil" 
										        data-toggle="tooltip" 
										        data-original-title="修改">
										</button>
										<button @click="custom(index,'delete')"
											        class="btn btn-default fa fa-user-times" 
											        data-toggle="tooltip" 
											        data-original-title="删除">
										</button>
										<button @click="custom(index,'initpassword')"
											        class="btn btn-default fa fa-unlock-alt" 
											        data-toggle="tooltip" 
											        data-original-title="初始化密码">
										</button>
										<button @click="custom(index,'chooserole')"
											        class="btn btn-default fa fa-user-circle" 
											        data-toggle="tooltip" 
											        data-original-title="角色维护">
										</button>
										<button @click="custom(index,'exchangedept')" v-if="is_admin == 0 || is_admin == 1"
											        class="btn btn-default fa fa-exchange" 
											        data-toggle="tooltip" 
											        data-original-title="转部门">
										</button>
				    				</td>
				    			</tr>
							</tbody>
						</table>
						<div class="byking-foot-panel" v-if="total > 0">
							<div class="byking-foot-left">
								<label>每页显示</label>
								<select @change="setPageSize($event)">
									<option>10</option>
									<option>20</option>
									<option>50</option>
								</select>
								<label>条数据    共<font color="red">{{pages}}</font>页</label>
							</div>
							<div class="byking-panel-right">
								<!-- <div class="byking-page-buts"> -->
								<div class="btn-group byking-page-buts">
									<button :disabled="isFirstPage" @click="toFirst" class="btn btn-default"><i class="fa fa-fast-backward"></i></button>
									<button :disabled="isFirstPage" @click="backward" class="btn btn-default"><i class="fa fa-backward"></i></button>
									<label style="display:none">...</label>
									<button v-for="n in pages" :disabled="pageIndex==(n+1)" @click="selectPage(n+1)" class="btn btn-default">{{n+1}}</button>
									<button :disabled="isLastPage" @click="forward" class="btn btn-default"><i class="fa fa-forward"></i></button>
									<button :disabled="isLastPage" @click="toLast" class="btn btn-default"><i class="fa fa-fast-forward"></i></button>
								</div>
							</div>				
						</div>
					</div>
					
					<div v-if="total == 0" class="byking-content-empty">
						<font>没有数据</font>
					</div>
				</div>
			</section>
		</div>
	</section>
</body>

	<script type="text/javascript">
	
	/*
	 * 角色列表
	 */	
	$tableData.addTable($hostconfig.sysAuthHost+"/department/roles", "#depRoleRel", function(index, type, event){
		
	}, false, false, false, 1, ["depId","depName"], true ,"#depRoleRel");
	
	//url, id, func, isCheck, isInit, isPage, column, add, isLoading, loadingId
	
	/*
	 * 账户列表
	 */	
	$tableData.addTable($hostconfig.sysAuthHost+"/department/users", "#depUserRel", function(index, type, event){
		if(type === "add") {
			var users = $tableData.getVue('#depUserRel');
			var title = "新增账号";
			var url = "authority/department/addsysuser.html?guid="+users.depId;
			var area = ["600px", "450px"];
			$byking.showModal(title,url,area);
		} else if (type === "modify") {
			var users = $tableData.getVue('#depUserRel');
			var content = this.page[index];
			var title = "【"+content.name+"】修改信息";
			var url = "authority/department/modifysysuser.html?guid="+users.depId+"&userId="+content.guid;
			var area = ["600px", "450px"];
			$byking.showModal(title,url,area);
		} else if (type === "delete") {
			var content = this.page[index];
			var index = layer.confirm("确认删除记录？", {
				  btn: ["确认", "取消"] 
				}, function(index, layero){
					var url = $hostconfig.sysAuthHost+"/user/del?guid="+content.guid;
					$byking.getJSONWithToken(url,function(data){
						$tableData.getVue('#depUserRel').resetUrl();
						layer.close(index);
					},function(data){
						layer.msg(data.responseJSON.message,{icon:5});
						layer.close(index);
					} );
				});
		} else if (type === "initpassword") {
			var content = this.page[index];
			var index = layer.confirm("确认初始化密码？", {
				  btn: ["确认", "取消"] 
				}, function(index, layero){
					var url = $hostconfig.sysAuthHost+"/user/passwd/reset?reset_user_guid="+content.guid+"&user_guid="+$byking.getCookieValue("user_guid");
					$byking.getJSONWithToken(url,function(data){						
						layer.close(index);
					},function(data){
						layer.msg(data.responseJSON.message,{icon:5});
						layer.close(index);
					});
				});
		} else if (type === "chooserole") {
			if($tableData.getVue('#depRoleRel').total == 0) {
				layer.msg("该部门没有可选角色!",{icon:5});
				return;
			}
			var content = this.page[index];
			var users = $tableData.getVue('#depUserRel');
			var title = "【"+content.name+"】角色维护";
			var url = "authority/department/chooserole.html?departmentId="+users.depId+"&userId="+content.guid;
			var area = ["600px", "300px"];
			$byking.showModal(title,url,area);
		} else if (type === "exchangedept") {
			var content = this.page[index];
			var users = $tableData.getVue('#depUserRel');
			var title = "【"+content.name+"】部门转移";
			var url = "authority/department/changedepartment.html?userId="+content.guid;
			var area = ["600px", "300px"];
			$byking.showModal(title,url,area);
		}
	}, false, false, true, 1, ["depId","depName","is_superadmin","is_admin"], true, "#depUserRel");
	
	function refrehUserList(){
		$tableData.getVue("#depUserRel").resetUrl();	
	}
	
	var departmentInfo = new Vue({
            el: "#departmentInfo",
            data: {
            	data:null,
            	is_superadmin:$byking.getCookieValue("is_superadmin")
            },
            methods: {
            	/**
                 * 设置数据
                 * @param obj
                 */
                setVal: function (obj) {
                    this.data = obj;
                },
                addParentDep: function (){
                	$('#depRoleRel').hide();
  					$('#depUserRel').hide();
  					departmentInfo.setVal(null);
  					
                	var title = "新增顶级组织";
            		var url = "authority/department/adddepartment.html";
            		var area = ["500px", "300px"];
            		$byking.showModal(title,url,area);
                },
                addDepartment: function () {
                	var title = "【"+this.data.name+"】新增下级组织";
            		var url = "authority/department/adddepartment.html?guid="+this.data.guid;
            		var area = ["500px", "300px"];
            		$byking.showModal(title,url,area);
                },
                modifyDepartment: function () {
                	var title = "修改【"+this.data.name+"】部门信息";
            		var url = "authority/department/modifydepartment.html?guid="+this.data.guid;
            		var area = ["500px", "300px"];
            		$byking.showModal(title,url,area);
                },
                deleteDepartment: function() {
                	var guid = this.data.guid;
                	var index = layer.confirm("确认删除记录？", {
          			  btn: ["确认", "取消"] 
          			}, function(index, layero){
          				var url = $hostconfig.sysAuthHost+"/department/del?guid="+guid;
          				$byking.getJSONWithToken(url,function(data){
          					$("#departmentList").mLoading("show");
          					$('#depRoleRel').hide();
          					$('#depUserRel').hide();
          					$tree.getVue("#departmentList").refreh();
          					departmentInfo.setVal(null);
          					layer.close(index);
          				},function(data){
          					layer.msg(data.responseJSON.message);
          					layer.close(index);
          				} );
          			});
                }
            }
        });
	
	function refrehDepartmentTree(data){
		$("#departmentList").mLoading("show");
		$tree.getVue("#departmentList").refreh();
		if(data){
			departmentInfo.setVal(data);
		}
	}
	
	$tree.addTree($hostconfig.sysAuthHost+"/department/query?user_guid="+$byking.getCookieValue("user_guid"),"#departmentList",function(item,e){
		departmentInfo.setVal(item);
		
		var is_superadmin = $byking.getCookieValue("is_superadmin");
		//账号不能对自己归属部门操作
		if(item.level==1 && is_superadmin!=1){
			$('#depRoleRel').hide();
			$('#depUserRel').hide();
			return;
		}
		
		$("#depRoleRel").mLoading("show");
		var roles = $tableData.getVue('#depRoleRel');
		roles.depId = item.guid;
		roles.depName = item.name;
		roles.setCon("&guid="+item.guid);
		$('#depRoleRel').show();
		
		var users = $tableData.getVue('#depUserRel');
		users.is_superadmin = $byking.getCookieValue("is_superadmin");
		users.is_admin = $byking.getCookieValue("is_admin");
		$("#depUserRel").mLoading("show");
		users.depId = item.guid;
		users.depName = item.name;
		users.setCon("&guid="+item.guid);
		$('#depUserRel').show();
		
	}, true, "#departmentList");
</script>
</html>